<!-- 搜索 -->
<section class="pr-block">

  <header class="pr-block-title">
    <h4><a class="pr-block-title-a" href="javascript:;">商品搜索</a></h4>
  </header>
  
  <div class="pr-block-content clearfix">

    <form id="search-form" action="/" onsubmit="return false">

      <div class="flex-row pr-search-container">
        <input id="search-word" class="pr-search-input row-item row-item-8" type="text" name="keywords" placeholder="输入商品名称搜索">
        <button id="search-submit" class="pr-search-submit row-item-2">
          <em class="iconfont pr-search-btn">&#xe603;</em>
        </button>
      </div>
      
    </form>

  </div>

</section>

<!-- 热销产品 -->
<section id="search-result" class="pr-block dn">

  <header class="pr-block-title">
    <h4><a class="pr-block-title-a" href="javascript">搜索结果</a></h4>
  </header>
  
  <div id="search-result-content" class="pr-block-content clearfix"></div>

  <a id="read-more" class="read-more w100 dn" href="javascript:;">加载更多</a>

</section>

<template id="list-tpl">

  {{each data as value i}}
  <a class="pr-item" href="{{value.url}}">

    <figure class="pr-item-image">
      <img class="w100" src="{{value.pic}}">
    </figure>

    <section class="pr-item-info">
      <p class="pr-item-name">{{value.name}}</p>
      <p class="pr-item-price">
        <b class="pr-item-nowprice">￥{{value.price}}</b>
        <notempty name="vo.price_high"><del class="pr-item-originprice">{{value.price_height}}</del></notempty>
      </p>
      <p class="pr-item-saled-count">销量：{{value.saled_count+value.saled_base}}</p>  
    </section>

  </a>
  {{/each}}

</template>

<script type="text/javascript">
  $(function(){

    var page = 1;
    var readMore = $("#read-more"),
        searchWord = $("#search-word"),
        searchResultContent = $("#search-result-content");

    $("#search-submit").on("tap", function() {
      page = 1;
      searchPost();
    });

    function searchPost( append ) {
      APP.showLoading();
      var url = "__CONTROLLER__/search",
          data = {};
      data.sid = {$sid};
      data.p = page;
      data.keywords = $(searchWord).val();

      $.post(url, data, function( response ) {

        $("#search-result").show();

        if ( !response.extra.data ) {
          $(readMore).off("tap").hide();
          $(searchResultContent).html("没有为您查询到结果，换个搜索词试试吧T_T");
        } else {
          insertList( response, append );
          $(readMore).show();
          append && $(readMore).html("已经没有更多了T_T");
        }
        
        APP.hideLoading();
      });

    };

    function insertList( data, append ) {

      page++;

      require(["artTemplate"], function(T) {
        var html = T("list-tpl", data.extra);
        append ? $(searchResultContent).append(html)
               : $(searchResultContent).html(html);
      });

    };

    $(readMore).on("tap", function() {
      searchPost(true);
    });

  });
  
</script>